
<!DOCTYPE html>
<html>
<head>

	<title>讨论中心</title>

	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<meta name="keywords" content="Friends Chat History Widget Responsive, Login Form Web Template, Flat Pricing Tables, Flat Drop-Downs, Sign-Up Web Templates, Flat Web Templates, Login Sign-up Responsive Web Template, Smartphone Compatible Web Template, Free Web Designs for Nokia, Samsung, LG, Sony Ericsson, Motorola Web Design" />
	<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
	<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
	<script language="javascript" src="__static__/common/sign.js"></script>
	<script language="javascript"  src="__static__/common/json.js"></script>
	<script language="javascript" src="__static__/common/md5.js"></script>
	<script language="javascript" src="__static__/common/base64.js"></script>
	<script language="javascript" src="__static__/js/url.js"></script>

	<!-- Style --> <link rel="stylesheet" href="__static__/css/chat.css" type="text/css" media="all">

	<link href='//fonts.googleapis.com/css?family=Raleway:400,500,600,700,800' rel='stylesheet' type='text/css'>
	<link href='//fonts.googleapis.com/css?family=Open+Sans:400,600,700' rel='stylesheet' type='text/css'>

</head>

<body>

	<h1>discuss</h1>

	<div class="container w3layouts agileits">
		<div id="chatbox">
			<div id="friendslist">
				<div id="topmenu">
					<span class="friends">主题</span>
				</div>

				<div id="friends">
					{volist name ='list' id ='l'}
					<div class="friend" >
						<img src="__static__/images/winter-soldier.jpg">
						<ul>
							<li style="display: none">
								<strong>{$l.id}</strong>
							</li>
						</ul>
						<p>
							<strong>{$l.content}</strong><br>
							<span>{$l.createtime}</span>
						</p>
						<div class="status available"></div>
					</div>
					{/volist}
					<div id="search">
						<input type="text" id="searchfield" value="Search contacts...">
					</div>
				</div>

			</div>

			<div id="chatview" class="p1">
				<div id="profile">
					<div id="close">
						<div class="cy"></div>
						<div class="cx"></div>
					</div>
					<p>Bucky Barnes</p>
					<span>wintersoldier@gmail.com</span>
				</div>

				<div id="chat-messages">
					<strong style="display: none" id="id">dddd</strong>
					<div class="message">
						<em>username</em>
						<div class="bubble">
							content
							<span>createtime</span>
						</div>
					</div>
				</div>

				<div id="sendmessage">
					<em id="tihuan"><input type="text" id="content" value="Send message..."></em>
					<button id="send"></button>
				</div>
			</div>
		</div>
	</div>

	<div class="footer">
		<p> &copy; 2016 Friends Chat History Widget. All Rights Reserved | <a onclick="history.go(-1)">返回</a></p>
	</div>

	<script src="__static__/js/jquery.min.js"></script>
	<script src="__static__/js/tabs.js"></script>
	<script>
        $('#send').click(function () {
            var id = $('#id').html();
            var child_content = $('#content').val();
            sign.params = {
                content: child_content,
                pid: id,
                id: id
            }
            var encode_data = sign.encode_post();
            console.log(encode_data);
            $.post(url_list.child_mes_add, encode_data, function (data) {
                //解码
                if (typeof data == 'string') {
                    data = eval('(' + data + ')');
                }
                data = sign.decode_post(data);
                console.log(data);
                $.post(url_list.user_chat_child, encode_data, function (data) {
                    //解码
                    if (typeof data == 'string') {
                        data = eval('(' + data + ')');
                    }
                    data = sign.decode_post(data);
                    var html ='';
                    console.log(data['data']);
                    listc = data['data'];
                    for (var i in listc) {
                        listc[i].content = listc[i].content ? listc[i].content : '';
                        listc[i].createtime = listc[i].createtime ? listc[i].createtime : '';
                        listc[i].username = listc[i].username ? listc[i].username : '';

                        html += '<em>' + listc[i].username + '</em>';
                        html += '<div class="bubble">' + listc[i].content;
                        html += '<span>' + listc[i].createtime + '</span>';
                        html += '</div>';

                        send ='<input type="text" id="content" value="">';
                    }
                    $('.message').html(html);
                    $('#tihuan').html(send);
                })
            })
            return false;
        })
	$(function () {
        $('#searchfield').change(function () {
            var content = $('#searchfield').val();
            var html ='';
            var send =''
            sign.params = {
                keyword: content,
            }
            var encode_data = sign.encode_post();
            console.log(encode_data);
            $.post(url_list.user_chat_search,encode_data,function (data) {
                //解码
                if (typeof data == 'string') {
                    data = eval('(' + data + ')');
                }
                data = sign.decode_post(data);
                if (data['data']['list']=== undefined || data['data']['list'].length == 0){
                    html ='<h1 style="color: #df8505">暂无数据</h1>';
                    html+=	'<div id="search">';
                    html+=	'<input type="text" id="searchfield" value=""> ' +
                        '</div>';
                    //页面数据替换
                    $('#friends').html(html);
//                    $('.friend').html(html);
//                    $('#aaaa').html(html);
                }
                else{
                    console.log(data['data']['list']);
                    listc = data['data']['list'];
                    for (var i in listc) {
                        listc[i].content = listc[i].content ? listc[i].content : '';
                        listc[i].createtime = listc[i].createtime ? listc[i].createtime : '';
                        listc[i].id = listc[i].id ? listc[i].id : '';

                        html += '<div class="friend" >';
						html+=	'<img src="__static__/images/winter-soldier.jpg">';
                        html += '<ul><li style="display: none">';
                        html += '<strong>' + listc[i].id + '</strong>';
                        html += '</li></ul>';
                        html += '<p><strong>' + listc[i].content + '</strong><br>';
                        html += '<span>' + listc[i].createtime + '</span></p>'
                        html += '<div class="status available"></div>';
						html +='</div>';
                        html+=	'<div id="search">';
                        html+=	'<input type="text" id="searchfield" value=""> ' +
                            '</div>'
                    }
                    $('#friends').html(html);
//                    $('.friend').html(html);
//                    $('#aaaa').html(html);
                }
            })
        })
    })

	</script>

</body>
</html>